<template>
  <el-dialog
    :visible.sync="showLotInfo"
    :close-on-click-modal="false"
    :before-close="handleClose"
    title="Lot Info"
    width="80%">
    <el-tabs v-model="activeName" type="border-card" @tab-click="tabClick">
      <el-tab-pane label="Lot Tooling History" name="1">
        <toolingTable :table-list="toolingTableList"/>
      </el-tab-pane>
      <el-tab-pane label="Hold History" name="2">
        <holdTable :table-list="holdTableList"/>
      </el-tab-pane>
      <el-tab-pane label="EQP Action His" name="3">
        <eqpActionTable :table-list="eqpTableList"/>
      </el-tab-pane>
      <el-tab-pane label="Eqp Physical Data" name="4">
        <physicalTable :table-form="physicalTable"/>
      </el-tab-pane>
    </el-tabs>
  </el-dialog>
</template>

<script>
import toolingTable from './toolingTable'
import holdTable from './holdTable'
import eqpActionTable from './eqpActionTable'
import physicalTable from './physicalTable'
import workRecordApi from '@/api/production/workRecord'
export default {
  name: 'WorkLotInfo',
  components: { toolingTable, holdTable, eqpActionTable, physicalTable },
  mixins: [],
  props: {},
  data() {
    return {
      showLotInfo: false,
      activeName: '1',
      tempVar: {},
      toolingTableList: [],
      holdTableList: [],
      eqpTableList: [],
      physicalTable: {}
    }
  },
  computed: {},
  watch: {},
  created() {},
  mounted() {},
  methods: {
    tabClick(tab) {
      if (tab.name === '2' && !this.holdTableList.length) {
        // 执行hold代码
        this.getHoldHistory()
      } else if (tab.name === '3' && !this.eqpTableList.length) {
        this.getEqpAction()
      } else if (tab.name === '4' && !Object.keys(this.physicalTable).length) {
        this.getPhysical()
      }
    },
    // 打开弹窗执行第一个active
    async handleOpen(val) {
      this.tempVar = val
      const res = await workRecordApi.getLTHLotInfoList({ LotId: val.lotId, trackinTime: val.trackStamp })
      this.toolingTableList = res.data
      this.showLotInfo = true
    },
    // 获取HoldHistory数据
    async getHoldHistory() {
      const res = await workRecordApi.getHoldHistoryList({ LotId: this.tempVar.lotId, trackinTime: this.tempVar.trackStamp })
      this.holdTableList = res.data
    },
    // 获取action数据
    async getEqpAction() {
      const res = await workRecordApi.getEqpActionList({ LotId: this.tempVar.lotId, trackinTime: this.tempVar.trackStamp })
      this.eqpTableList = res.data
    },
    // 获取physical数据
    async getPhysical() {
      const { lotId, eqp1Id, eqp2Id } = this.tempVar
      const res = await workRecordApi.getPhysicalList({ lotId, eqp1Id, eqp2Id, trackinTime: this.tempVar.trackStamp })
      this.physicalTable = res.data
    },
    handleClose() {
      Object.assign(this.$data, this.$options.data.call(this))
    }
  }
}
</script>

<style scoped lang="scss"></style>
